<div class="container_16">
    <div class="push_2 grid_10 containerHeight">
        <h2><?= lang("venderAccionesTit"); ?></h2>
        <fieldset style="border-color: red;">
            <legend><?= lang("acciones"); ?></legend>
            <table id="inversiones">
                <thead>
                    <tr>
                        <th><?= lang("nombreEmpresa"); ?></th>
                        <th><?= lang("ticker"); ?></th>
                        <th><?= lang("fecha"); ?></th>
                        <th><?= lang("valorCompra"); ?></th>
                        <th><?= lang("cantidad"); ?></th>
                        <th><?= lang("valorTotal"); ?></th>
                        <th><?= lang("valorActual"); ?></th>
                    </tr>
                </thead>
                <tbody>
                    <?php foreach ($inversion as $i): ?>
                        <tr>
                            <td><?= $i->nombre ?></td>
                            <td><?= $i->ticker ?></td>
                            <td><?= $i->fecha ?></td>
                            <td><?= $i->valorCompra ?></td>
                            <td class="cantidad"><?= $i->cantidad ?></td>
                            <td><?= $i->valorTotal ?></td>
                            <td id="<?= $i->valorActual ?>"><?= $i->valorActual ?></td>
                        </tr>
                    <?php endforeach; ?>
                    </tbody>
                </table>
            </fieldset>
            <fieldset style="border-color: red;">
                <legend><?= lang("valoresDeVenta"); ?></legend>
                <table>
                    <tr>
                        <td><?= lang("cantidad"); ?>:</td>
                        <td><input id="txtCantidad" type="text" onkeyup="calcularTotal()"/></td>
                        <td>Total:</td>
                        <td><input id="total" type="text" disabled=""/></td>
                    </tr>
                </table>
            </fieldset>
            <fieldset style="border-color: red;">
                <legend><?= lang("tusCuentas"); ?></legend>
                <table width="100%">
                <?php foreach ($cuentas as $c): ?>
                            <tr>
                                <td>
                                    <input id="<?= $c->id ?>" type="radio" class="rb" name="cuenta" value="<?= $c->id ?>"/>
                                    <label for="<?= $c->id ?>"><?= $c->codigoEntidad ?> - <?= $c->codigoOficina ?>
                                        - <?= $c->codigoEntidad ?>
                                        - <?= $c->codigoControl ?> - <?= $c->codigoCuenta ?></label>
                                </td>
                            </tr>
                <?php endforeach; ?>
                        </table>
                    </fieldset>
                    <button id="aceptar" type="button"><?= lang("vender"); ?></button>
                </div>
            </div>

            <div id="oculto" style="display: none;">
                <center><?= lang("estasSeguroAcciones"); ?></center>
            </div>

            <div id="cantidad" style="display: none;">
                <center><?= lang("indicaCantidadAcciones"); ?></center>
            </div>

            <div id="superar" style="display: none;">
                <center><?= lang("noPuedesVender"); ?></center>
            </div>

            <div id="cuenta" style="display: none;">
                <center><?= lang("seleccionaCuenta"); ?></center>
            </div>

            <script>
                $(document).ready(function () {

                    var idCuenta;

                    $('#inversiones').dataTable({
                        "bJQueryUI":true,
                        "bInfo":false,
                        "bSort":false,
                        "bAutoWidth":false,
                        "bPaginate":false,
                        "oLanguage": {
                            "sUrl": "<?= lang('datatables_lng') ?>"
                        }
                    });
                    $('#aceptar').click(function () {
                        $('#oculto').dialog({modal:true,
                            height:150,
                            width:250,
                            resizable:false,
                            buttons:[
                                {
                                    text:"Cancelar",
                                    click:function () {
                                        $(this).dialog("close");
                                    }
                                },
                                {
                                    text:"Aceptar",
                                    click:function () {
                                        $(this).dialog("close");
                                        venta();
                                    }
                                }
                            ]
                        });
                    });
                });

                function radioIsChecked(radio) {
                    for (var i in radio) {
                        if (radio[i].checked === true) {
                            return true;
                        }
                    }
                    return false;
                }

                $("input[name=cuenta]:radio").click(function () {
                    idCuenta = $(this).attr("value");
                });

                function venta() {
                    if ($("#txtCantidad").val() === "") {
                        indicaCantidad();
                    } else {
                        if (radioIsChecked(document.getElementsByName('cuenta'))) {
                            var valor = $("#inversiones tbody tr").children(":last").text();
                            valor = parseFloat(valor);
                            window.location = "backend/inversiones/inversiones/venderAcciones/<?= $inversion[0]->idAccion ?>/"+$("#txtCantidad").val()+"/"+idCuenta+"/<?= $i->idEmpresa ?>/<?= $idCliente ?>/"+valor;
            } else {
                $('#cuenta').dialog({modal:true,
                    height:150,
                    width:250,
                    resizable:false,
                    buttons:[
                        {
                            text:"Aceptar",
                            click:function () {
                                $(this).dialog("close");
                            }
                        }
                    ]
                });
            }
        }
    }

    function indicaCantidad() {
        $('#cantidad').dialog({modal:true,
            height:150,
            width:250,
            resizable:false,
            buttons:[
                {
                    text:"Aceptar",
                    click:function () {
                        $(this).dialog("close");
                    }
                }
            ]
        });
    }

    function calcularTotal() {
        var numero = $("#inversiones tbody tr").children(":last").text();
        numero = parseFloat(numero);
        numero = numero * parseInt($("#txtCantidad").val());
        if (isNaN(numero)) {
            $("#txtCantidad").val('');
        } else {
            var cantidad = $("#inversiones tbody tr").children(".cantidad").text();
            cantidad = parseInt(cantidad);
            if (parseInt($("#txtCantidad").val()) <= cantidad) {
                var numTotal = parseFloat(numero).toFixed(2);
                numTotal = numTotal.replace(".", ",");
                $("#total").attr("value", numTotal + '\u20AC');
            } else {
                $('#superar').dialog({modal:true,
                    height:150,
                    width:250,
                    resizable:false,
                    buttons:[
                        {
                            text:"Aceptar",
                            click:function () {
                                $(this).dialog("close");
                            }
                        }
                    ]
                });
                $("#txtCantidad").val('');
                $("#total").val('');
            }
        }
    }
</script>
<style>
    .dataTables_filter {
        display: none;
    }
</style>